<template>
  <router-view />
</template>

<script setup>
import useSettingsStore from "@/store/modules/settings";
import { handleThemeStyle } from "@/utils/theme";
import { isPhone } from "@/utils/index";

onMounted(() => {
  if (isPhone) {
    document.body.id = "is-phone";
  }
  nextTick(() => {
    // 初始化主题样式
    handleThemeStyle(useSettingsStore().theme);
  });
});
</script>

<style lang="scss">
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield; /* Firefox */
}

.el-select,
.el-input-number {
  width: 100%;
}
.el-form-item__label {
  display: flex;
  align-items: center;
  line-height: 1.2 !important;
}

.el-button + .el-button {
  margin-left: 10px !important;
}

#is-phone {
  .el-overlay-dialog {
    overflow: hidden;
    .el-dialog {
      margin-top: 0 !important;
      width: 100vw !important;
      height: 100vh !important;
      overflow: auto;
    }
  }
}
</style>
